var wxCharts = require('../../utils/wxcharts.js');
let sliderWidth = 96; // 需要设置slider的宽度，用于计算中间位置
const app = getApp()
var lineChart = null;

Page({
  data: {
    tabs: ["今日排行", "本周排行", "汗水记录"],
    activeIndex: 0,
    sliderOffset: 0,
    sliderLeft: 0,
    userinfo: null,
    today_list:[],
    today_first:'',
    week_list:[],
    week_first:'',
    abscissa:[],
    ordinate:[],
    winHeight:0,
    winWidth:0,
    userId:0
  },
  // 数据加载
  onLoad: function(options) {
    app.editTabBar();
    var that=this
    console.log(app);
    that.setData({
       userId:app.d.userId ,
    });
    that.step_list();
    that.initNavHeight();
       console.log(that.data.abscissa);
        console.log(that.data.ordinate);
        console.log(that.data.week_list);
   that.createSimulationData();
    //图表开始
       var windowWidth = 320;
     try {
            var res = wx.getSystemInfoSync();
            windowWidth = res.windowWidth;
        } catch (e) {
            console.error('getSystemInfoSync failed!');
        }

       setTimeout(function () {
          lineChart = new wxCharts({
            canvasId: 'lineCanvas',
            type: 'line',
            categories: that.data.abscissa,
            animation: true,
            legend:false,
            // background: '#f5f5f5',
            series: [{
                name: '步数',
                data: that.data.ordinate,
                format: function (val, name) {
                    return val;
                }
            }],
            xAxis: {
                disableGrid: true
            },
            yAxis: {
                title: '步数',
                format: function (val) {
                    return val;
                },
                min: 0
            },
            width: windowWidth,
            height: 200,
            dataLabel: false,
            dataPointShape: true,
            extra: {
                lineStyle: 'curve'
            }
          });
         lineChart = new wxCharts({
            canvasId: 'lineCanvas1',
            type: 'line',
            categories: that.data.bheng,
            animation: true,
            legend:false,
            // background: '#f5f5f5',
            series: [{
                name: 'BMI',
                data: that.data.bmi,
                format: function (val, name) {
                    return val;
                }
            },
            {
                name: '最低',
                data: that.data.bm,
                format: function (val, name) {
                    return val;
                }
            },
            {
                name: '最高',
                data: that.data.bma,
                format: function (val, name) {
                    return val;
                }
            }],
            xAxis: {
                disableGrid: true
            },
            yAxis: {
                title: '历史BMI趋势',
                format: function (val) {
                    return val;
                },
                min: 15
            },
            width: windowWidth,
            height: 200,
            dataLabel: false,
            dataPointShape: true,
            extra: {
                lineStyle: 'curve'
            }
          });
        }
                  , 2000)

    //图表结束

  },
  onReady: function (options) {
    let that = this
    console.log(this.data.step_day)
    wx.getSystemInfo({
      success: function (res) {
        that.setData({
          sliderLeft: (res.windowWidth / that.data.tabs.length - sliderWidth) / 2,
          sliderOffset: res.windowWidth / that.data.tabs.length * that.data.activeIndex
        });
      }
    });
  },
  tabClick: function (e) {
    this.setData({
      sliderOffset: e.currentTarget.offsetLeft,
      activeIndex: e.currentTarget.id
    });
  },
   touchHandler: function (e) {
    var that=this

        console.log(lineChart.getCurrentDataIndex(e));
        lineChart.showToolTip(e, {
            // background: '#7cb5ec',
            format: function (item, ordinate) {
                return ordinate + ' ' + item.name + ':' + item.data 
            }
        });
    },    
    createSimulationData: function () {
      var that=this;
        var categories = [];
        var data = [];

        return {
            categories: that.data.abscissa,
            data: that.data.ordinate
        }
    },
    updateData: function () {
        var simulationData = this.createSimulationData();
        var series = [{
            name: '步数',
            data: that.data.ordinate,
            format: function (val, name) {
                return val ;
            }
        }];
        lineChart.updateData({
            categories: simulationData.categories,
            series: series
        });
  },
  step_list:function(){
    var that=this;
         wx.request({
          url: app.d.ceshiUrl + '/Api/Step/step_list',
          method: 'post',
          data: {
            uid:app.d.userId
          },
          header: {
            'Content-Type': 'application/x-www-form-urlencoded'
          },
          success: function (res) {

            that.setData({
              today_list:res.data.today_list,
              today_first:res.data.today_first,
              week_first:res.data.week_first,
              week_list:res.data.week_list,
              abscissa:res.data.heng,
              ordinate:res.data.zong,
              bheng:res.data.bheng,
              bm:res.data.bm,
              bma:res.data.bma,
              bmi:res.data.bmi
            })
           var jiu = res.data.today_list
                var nArr = [];
                for (var i in jiu){
                  nArr.push(jiu[i]);
              }
        console.log(that.data.today_list);
        console.log(nArr.length);
         that.setData({
              winHeight:(nArr.length+4)*60*2,
            })
          },
          error: function (e) {
            wx.showToast({
              title: '网络不给力！',
              duration: 2000,
            });
          },
      });

  },
  initNavHeight: function() { ////获取系统信息
    var that = this;
    wx.getSystemInfo({
      success: function(res) {
        that.setData({
          winWidth: res.windowWidth,
          // winHeight: res.windowHeight
        });
      }
    });
  },
  tiaozhuan: function (e) { 
    var viewId = e.target.id; 
    var viewDataSet = e.target.dataset; 
    var viewText = viewDataSet.text; 
    console.log(viewId); 
    //输出点击的view的id，第二种情况就不重复写了 
    console.log(viewText); //输出该文本 
  },
});